Ext.ns("CRM.SPComp");

(function(){

	
	
			CRM.SPComp.createOppSearchComp = function(gridId,dataStore, columnModel, criteriaStore){
	       	                           	                             		
	     	var gridView = new Ext.grid.GridView();
	     	var selModel = new Ext.grid.RowSelectionModel({singleSelect : true});
	     	var spSearchOppGridPanel = new Ext.grid.GridPanel({
	       	      autoHeight 	: true,
	       	      id			: gridId,
	       	      width			: 1060,
	       	      view 			: gridView,
	       	      title			: 'Opportunity Details',
	       	      store			: dataStore,
	       	      colModel 		: columnModel,		
	       	      selModel 		: selModel,
	       	      stripeRows	: true,
	       	      enableRowBody : true,
	       	      scrollable	: true,
	       	      frame			: true
	       	   });		
		
	     	var dynamicGridPanel = new Ext.Panel({
	     		width    : 1085,
	     		items 	: [
							{
								xtype		: 'panel',
								id			: 'combinePanel',
								autoHeight 	: true,
								width		: 1085,
								frame		: true,
								padding		: '5px',
								items		: [
												 {
												 xtype       : 'fieldset',
											     id          : 'criteriaPanel',
											     title       : 'Search Criteria',
											     height      : 65,
											     width       : 1060,
											     labelWidth  : 120,
											     layout      : 'hbox',
											     items       : [
											                      {
											                    	 xtype : 'compositefield',
											                    	 items : [	
											                    				{ xtype : 'displayfield', value : 'Search Criteria : '},
											                       				{
											                    	   				xtype 		: 'combo',
											                    	   				id	  		: 'oppSearchCriteria',
											                    	   				store		:  criteriaStore,
											                                        displayField: 'criteria',
											                                        valueField  : 'id',
											                                        value		: 'SELECT',
											                                        triggerAction:'all',
											                    	   				width 		: 200,
											                    	   				editable	: false
											                       				},
											                       				{ xtype : 'displayfield', value : 'Value : '},
											                       				{ 
											                       					xtype    : 'textfield',
											                       					id	     : 'criteriaValue',
											                       					name     : 'criteriaValue',
											                       					enableKeyEvents : true,
											                       					width    : 350,
											                       					enableKeyEvents: true,
											                       					listeners: {keyup: function(){
											                       										doSearch(true,spSearchOppGridPanel);
											                       									}
											                       								}											                       					
											                       				 },
											                       				 {
											                       				    xtype : 'button',
												                       				text  : 'Search',
												                       				handler : function(){
												                       							doSearch(false);
												                       						 }
											                       				    },
											                       				    {
											                       				    	xtype	: 'button',
											                       				    	text	: 'Clear Search',
											                       				    	handler : function(){
											                       				    				//var oppGrid = Ext.getCmp('spSearchOppGridPanel');
											                       				    						spSearchOppGridPanel.store.removeAll();
											                       				    			 }
											                       				    }
											                       				
											                    			]
											                       }
																 ]
												 		},
														{
															xtype : 'panel',
															items : [{
																			width	: 1300,
																			items	: [spSearchOppGridPanel]
																	}]
														}
												 ]
							}
						]
	     	
	     	});
	     	
	     	function doSearch(ONKEYEVENT,oppGrid){
	     		var selectedCriteria = Ext.getCmp('oppSearchCriteria').getValue();
				var passedValue = Ext.getCmp('criteriaValue').getValue();
				
				if(selectedCriteria == 'SELECT'){
 					Ext.Msg.alert('Alert','Please Select a Criteria');
 				}
 				
 				if(ONKEYEVENT == false){
 					if(passedValue == '' ){
 						Ext.Msg.alert('Alert','Please Enter Some Value to Search');
 					}
 				}
 				if(selectedCriteria != 'SELECT' && passedValue != ''){
 					//var oppGrid = Ext.getCmp('spSearchOppGridPanel');
						oppGrid.store.removeAll();
						oppGrid.store.reload({
			    			params: {
						            criteria: selectedCriteria,
									value: passedValue
			    					}
			    				});
 				}
	     	};
		
		return dynamicGridPanel;
	};
	

})();